<template>
	<view class="content">
		<up-navbar :fixed="false" title="修改工艺" :autoBack="true" :safeAreaInsetTop="true" leftIconColor="#fff">
		</up-navbar>

		<view class="MainBox">
			<up-form labelPosition="left" :model="formData" ref="baseFormRef" :rules="rules">

				<up-form-item labelWidth="120" label="工序名称" prop="ProcedureName" borderBottom leftIcon="file-text"
					required :leftIconStyle="{'font-size':'20px'}">

					<view class="iptView" @click="openBaseScreen('工序','radio')">
						<up-input style="width: 100%;" v-model="formData.ProcedureName" disabled disabledColor="#ffffff"
							placeholder="请选择" border="none"></up-input>
					</view>
					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>

				</up-form-item>

				<up-form-item labelWidth="120" label="工作中心" prop="FWorkshopName" borderBottom leftIcon="share" required
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView" @click="openBaseScreen('工作中心','radio')">

						<up-input v-model="formData.FWorkshopName" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>
				</up-form-item>

				<up-form-item labelWidth="120" label="是否外协" prop="OutsourceName" borderBottom leftIcon="file-text"
					required :leftIconStyle="{'font-size':'20px'}">
					<view class="iptView" @click="openBaseScreen('是否外协','radio')">

						<up-input v-model="formData.OutsourceName" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>
				</up-form-item>

				<up-form-item labelWidth="120" label="生产人员" prop="EmplName" borderBottom leftIcon="share"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView" @click="openBaseScreen('生产人员','radio')">

						<up-input v-model="formData.EmplName" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>
				</up-form-item>

				<up-form-item labelWidth="120" label="设备类型" prop="EquipmentTypeName" borderBottom leftIcon="file-text"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView" @click="openBaseScreen('设备类型','radio')">

						<up-input v-model="formData.EquipmentTypeName" disabled disabledColor="#ffffff"
							placeholder="请选择" border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>
				</up-form-item>

				<up-form-item labelWidth="120" label="设备" prop="EquipmentName" borderBottom leftIcon="file-text"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView" @click="openBaseScreen('设备','radio')">

						<up-input v-model="formData.EquipmentName" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>
				</up-form-item>

				<up-form-item labelWidth="120" label="模具类型" prop="MoludTypeName" borderBottom leftIcon="file-text"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView" @click="openBaseScreen('模具类型','radio')">

						<up-input v-model="formData.MoludTypeName" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>
				</up-form-item>

				<up-form-item labelWidth="120" label="模具" prop="MoludName" borderBottom leftIcon="file-text"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView" @click="openBaseScreen('模具','radio')">

						<up-input v-model="formData.MoludName" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="arrow-right"></up-icon>
					</template>
				</up-form-item>

				<up-form-item labelWidth="120" label="工价" prop="LabourCost" borderBottom leftIcon="coupon"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView">

						<up-input v-model="formData.LabourCost" placeholder="请输入" border="none"></up-input>
					</view>


					<template #right>
						<up-icon name="edit-pen-fill"></up-icon>
					</template>
				</up-form-item>
				<up-form-item labelWidth="120" label="工时" prop="ManHour" borderBottom leftIcon="coupon"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView">

						<up-input v-model="formData.ManHour" placeholder="请输入" border="none"></up-input>
					</view>

					<template #right>
						<up-icon name="edit-pen-fill"></up-icon>
					</template>
				</up-form-item>
				<up-form-item labelWidth="120" label="小时工价" prop="HourGJ" leftIcon="coupon"
					:leftIconStyle="{'font-size':'20px'}">
					<view class="iptView">

						<up-input v-model="formData.HourGJ" placeholder="请输入" border="none"></up-input>
					</view>

					<template #right>
						<up-icon name="edit-pen-fill"></up-icon>
					</template>
				</up-form-item>
			</up-form>
		</view>


		<view class="BottomBox" :style="uni.$utils.disposeSafeBottomFun()">
			<button class="SubBtn" style="width: 90%;" @click="submitBtn">确定</button>
		</view>

	</view>
</template>

<script setup lang="ts">
	import { ref, reactive, onMounted, computed } from 'vue'
	import { onLoad, onShow, onUnload } from '@dcloudio/uni-app'
	import useRequestQueue from '@/uni_modules/mc-ui/libs/http/UniversalRequestQueue';
	const { request, requestByUrl, PromiseRequestByUrl, onAllComplete, onError } = useRequestQueue();
	import { useMainStore, useUserStore, usePermissionStore, useTicketStore } from '@/store';
	const mainStore = useMainStore();
	const userStore = useUserStore();
	const permissionStore = usePermissionStore();
	const ticketStore = useTicketStore();

	// 表单信息
	let formData = reactive<any>({
		ProcedureName: '',
		ProcedureID: '',
		ProcedureCode: '',
		FWorkshopID: '',
		FWorkshopName: '',

		EmplName: '', // 生产人员
		EmplCode: '',
		EmplID: '',

		OutsourceName: '',

		EquipmentTypeName: '', // 设备类型
		EquipmentTypeID: '', // 设备类型
		EquipmentCode: '', // 设备
		EquipmentName: '',
		EquipmentID: '', // 设备

		MoludTypeName: '', // 模具类型
		MoludTypeID: '',
		MoludCode: '', // 模具
		MoludName: '',
		MoludID: '',

		LabourCost: '',
		ManHour: '',
		HourGJ: '',
	});

	let rules = {
		'FWorkshopName': {
			type: 'string',
			required: true,
			message: '请选择工作中心',
			trigger: ['change']
		}
	};

	interface UFormsInstance {
		validate : (callback ?: (isValid : boolean) => void) => Promise<boolean>
		resetFields : () => void
		validateField : () => void
	}
	const baseFormRef = ref<UFormsInstance | null>(null);

	let FWorkshop = reactive<any>({});
	// 主表表单数据
	let formData_main = reactive<any>({});

	const BaseScreenParm = mainStore.BaseScreenParm;

	// 顶级主表数据赋值
	Object.assign(formData_main, BaseScreenParm.formData);

	let backInfo = initData(BaseScreenParm);

	Object.assign(formData, backInfo);

	function initData(obj : any) {
		const { data } = obj;
		console.log(data);

		// 定义需要初始化的字段及其默认值配置
		const defaultFields = [
			{
				key: 'Outsource',
				value: 0,
				nameKey: 'OutsourceName',
				nameMap: (v) => v === 1 ? '是' : '否'
			},
			{
				key: 'EquipmentTypeID',
				value: 0,
				nameKey: 'EquipmentTypeName',
				nameValue: ''
			},
			{
				key: 'MoludTypeID',
				value: 0,
				nameKey: 'MoludTypeName',
				nameValue: ''
			},
			{ key: 'LabourCost', value: 0 },
			{ key: 'ManHour', value: 0 },
			{ key: 'HourGJ', value: 0 }
		];

		// 批量处理字段初始化
		defaultFields.forEach(field => {
			if (!(field.key in data)) {
				data[field.key] = field.value;

				// 处理名称字段
				if (field.nameKey) {
					data[field.nameKey] = field.nameMap
						? field.nameMap(field.value as number)
						: field.nameValue;
				}
			} else if (field.nameMap && field.nameKey) {
				// 如果字段已存在，更新对应的名称字段
				data[field.nameKey] = field.nameMap(data[field.key] as number);
			}
		});

		return data;
	}


	// 数据下拉选
	function openBaseScreen(str : string, type : string) {

		if ((str === '工序' || str === '工作中心' || str === '是否外协') && formData.WCQty > 0) {
			return uni.$utils.layer.alert('该工序已报工，禁止修改！');
		}

		switch (str) {
			case "工序":
				mainStore.openBaseScreen({
					allowClear: false, // 清除按钮
					cmd: 'XGD_Procedure', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "ProcedureName", // 显示值
							hiddenValue: "ProcedureID", // 隐藏值
							pageIndex: "PageIndex", // 分页状态页码字段
							pageSize: "PageSize", // 分页状态每页数量字段
						},
						isPaging: true, //是否分页
						searchKey: 'SearchKey', //搜索关键词，应包含在param中
						choiceData: formData.ProcedureID, // 选中数据
						choiceDataKey: "ProcedureID", // 选中数据的key
					},
					param: { // 传递参数
						SearchKey: '',
						PageIndex: 1,
						PageSize: 30
					}
				});

				break;
			case "工作中心":
				mainStore.openBaseScreen({
					allowClear: false, // 清除按钮
					cmd: 'XGD_Workshop', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "FWorkshopName", // 显示值
							hiddenValue: "FWorkshopID", // 隐藏值
							pageIndex: "PageIndex", // 分页状态页码字段
							pageSize: "PageSize", // 分页状态每页数量字段
						},
						isPaging: true, //是否分页
						searchKey: 'SearchKey', //搜索关键词，应包含在param中
						choiceData: formData.FWorkshopID, // 选中数据
						choiceDataKey: "FWorkshopID", // 选中数据的key
					},
					param: { // 传递参数
						SearchKey: '',
						PageIndex: 1,
						PageSize: 30
					}
				});

				break;
			case "是否外协":
				mainStore.openBaseScreen({
					allowClear: false, // 清除按钮
					cmd: '', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					multiple: false, // 是否开启多选
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "OutsourceName", // 显示值
							hiddenValue: "Outsource", // 隐藏值
						},
						isLocal: true, // 是否启用本地数据
						localData: [{
							OutsourceName: '是',
							Outsource: 1
						}, {
							OutsourceName: '否',
							Outsource: 0
						}], // 当开启本地数据时使用
						isPaging: false, //是否分页
						choiceData: formData.Outsource, // 选中数据
						choiceDataKey: "Outsource", // 选中数据的key
					},
					param: { // 传递参数
					}
				});
				break;
			case "设备类型":
				mainStore.openBaseScreen({
					allowClear: true, // 清除按钮
					cmd: 'XGD_EquipmentType', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "EquipmentTypeName", // 显示值
							hiddenValue: "EquipmentTypeID", // 隐藏值
							pageIndex: "PageIndex", // 分页状态页码字段
							pageSize: "PageSize", // 分页状态每页数量字段
						},
						isPaging: true, //是否分页
						searchKey: 'SearchKey', //搜索关键词，应包含在param中
						choiceData: formData.EquipmentTypeID, // 选中数据
						choiceDataKey: "EquipmentTypeID", // 选中数据的key
					},
					param: { // 传递参数
						SearchKey: '',
						PageIndex: 1,
						PageSize: 30
					}
				});
				break;
			case "模具类型":
				mainStore.openBaseScreen({
					allowClear: true, // 清除按钮
					cmd: 'XGD_MoludType', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "MoludTypeName", // 显示值
							hiddenValue: "MoludTypeID", // 隐藏值
							pageIndex: "PageIndex", // 分页状态页码字段
							pageSize: "PageSize", // 分页状态每页数量字段
						},
						isPaging: true, //是否分页
						searchKey: 'SearchKey', //搜索关键词，应包含在param中
						choiceData: formData.MoludTypeID, // 选中数据
						choiceDataKey: "MoludTypeID", // 选中数据的key
					},
					param: { // 传递参数
						SearchKey: '',
						PageIndex: 1,
						PageSize: 30
					}
				});

				break;

			case "生产人员":
				mainStore.openBaseScreen({
					allowClear: true, // 清除按钮
					cmd: 'XGD_Employee', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "EmplName", // 显示值
							hiddenValue: "EmplID", // 隐藏值
							pageIndex: "Pageindex", // 分页状态页码字段
							pageSize: "PageSize", // 分页状态每页数量字段
						},
						isPaging: true, //是否分页
						searchKey: 'EmplCode', //搜索关键词，应包含在param中
						choiceData: formData.EmplID, // 选中数据
						choiceDataKey: "EmplID", // 选中数据的key
					},
					param: { // 传递参数
						EmplCode: '',
						Pageindex: 1,
						PageSize: 30
					}
				});

				break;

			case "设备":
				mainStore.openBaseScreen({
					allowClear: true, // 清除按钮
					cmd: 'PGD_GetEquipment', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "EquipmentCode", // 显示值
							hiddenValue: "EquipmentID", // 隐藏值
						},
						isPaging: false, //是否分页
						searchKey: '', //搜索关键词，应包含在param中
						choiceData: formData.EquipmentID, // 选中数据
						choiceDataKey: "EquipmentID", // 选中数据的key
					},
					param: { // 传递参数
						EquipmentTypeID: formData.EquipmentTypeID,
						EquipmentCode: '',
						EquipmentID: 0,
					}
				});
				break;

			case "模具":
				mainStore.openBaseScreen({
					allowClear: true, // 清除按钮
					cmd: 'PGD_GetMolud', // 接口名
					titleName: str,
					listeningName: "choice_routingInfo", // 监听器
					serverSearch: { // 查询项
						format: { // 数据映射
							displayValue: "MoludCode", // 显示值
							hiddenValue: "MoludID", // 隐藏值
						},
						isPaging: false, //是否分页
						searchKey: '', //搜索关键词，应包含在param中
						choiceData: formData.MoludID, // 选中数据
						choiceDataKey: "MoludID", // 选中数据的key
					},
					param: { // 传递参数
						MoludTypeID: formData.MoludTypeID,
						MoludCode: '',
						MoludID: 0,
						ProductID: formData_main['ProductID'],
					}
				});
				break;
			default:
				break;
		}
	}

	// 确认按钮
	function submitBtn() {

		baseFormRef.value.validate().then((res : any) => {
			uni.$emit('change_routingEdit', {
				type: '工序',
				msg: '',
				data: formData
			});

			uni.navigateBack();
		}).catch(errors => {
			uni.$utils.msg(errors[0]['message'])
			// console.log(errors)
		})

	}


	onMounted(() => {
		uni.$on("choice_routingInfo", (ret : any) => {
			console.log(ret);
			switch (ret.titleName) {
				case "工序":
					let backData = initData(ret);

					Object.assign(formData, backData);
					break;
				case "设备类型":
					Object.assign(formData, backData);
					formData['EquipmentCode'] = '';
					formData['EquipmentName'] = '';
					formData['EquipmentID'] = '';

					break;
				default:
					Object.assign(formData, ret.data);
					break;
			};

			baseFormRef.value.validate();


		})
	});

	onUnload(() => {
		uni.$off("choice_routingInfo");
	})
</script>

<style lang="scss">
	uni-button {
		margin: initial;
	}

	.content {
		display: flex;
		flex-direction: column;
		height: 100vh;
		// height: calc(100vh - 60px);
		background-color: #f9f9f9;

		.MainBox {
			flex: 1;
			overflow: auto;

			// 表单1
			:deep(.u-form) {
				// padding: 0px 10px;
				background-color: #fff !important;
				padding: 0 16px !important;

				:deep(.up-form-item) {}
			}
		}

		.BottomBox {
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 10px 15px;
			background-color: #fff;
			border-top: 1px solid #efefef;

			.SaveBtn {
				width: 40%;
				background-color: #fff;
				color: #51d0d0;
				border: 1px solid #51d0d0;
				border-radius: 12px;
			}

			.SubBtn {
				width: 40%;
				background-color: #51d0d0;
				color: #fff;
				border-radius: 12px;
			}
		}

	}
</style>